<template>
  <!-- 银行转账 -->
  <div class="transfer" style="overflow:hidden;padding: 10px;">
    <mt-header fixed title="充值">
      <div slot="left"><mt-button @click="back()" icon="back"></mt-button></div>
    </mt-header>
    <div style="width:100%;height:.8rem;"></div>
    <!-- <p class="text_top">支付一：支付宝快捷充值（5万以下）</p>
    <div class>
      <p style="text-align: center">
        <img :src="require('../../assets/zfb.jpeg')" style="width: 300px" alt>
      </p>
      <p style="text-align: center">
        <a
          href="https://qr.alipay.com/fkx03804rozmph6nnuf4d9c"
          style="text-align: center;color: #00a2e8;line-height: 1rem;font-size:.4rem; letter-spacing: 1px;"
        >长按二维码或点击此链接充值</a>
      </p>
    </div>-->
    <!-- <p class="text_top">支付二：网银充值</p>
    <div class="tran_center">
      <p>周永谢</p>
      <p>中国农业银行</p>
      <p>充值卡号：6230521540012167674</p>
    </div>
    <div style="width:100%;
   margin:.5rem 0;">
      <p class="table_title">储蓄卡快捷支付限额总表</p>
      <table
        border="1"
        style=" width: 85%;
    margin: 0px auto;
    text-align: center;
    height:15rem;"
      >
        <tr>
          <th>银行</th>
          <th>额度</th>
        </tr>
        <tr>
          <td>中国银行</td>
          <td>单笔1万、单日1万、单月无限额</td>
        </tr>
        <tr>
          <td>农业银行</td>
          <td>单笔1万、单日1万、单月30万</td>
        </tr>
        <tr>
          <td>工商银行</td>
          <td>单笔1万、单日5万、单月10万</td>
        </tr>
        <tr>
          <td>交通银行</td>
          <td>单笔1万、单日1万、单月2万</td>
        </tr>
        <tr>
          <td>建设银行</td>
          <td>单笔1万、单日5万、单月10万</td>
        </tr>
        <tr>
          <td>平安银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>中信银行</td>
          <td>单笔5万、单日5万、单月无限额。</td>
        </tr>
        <tr>
          <td>光大银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>浦发银行</td>
          <td>单笔50万、单日50万、单月无限额</td>
        </tr>
        <tr>
          <td>招商银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>广发银行</td>
          <td>单笔3万、单日3万、单月无限额</td>
        </tr>
        <tr>
          <td>邮储银行</td>
          <td>单笔5000、单日5000、单月无限额</td>
        </tr>
        <tr>
          <td>民生银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>兴业银行</td>
          <td>单笔3万、单日3万、单月无限额</td>
        </tr>
        <tr>
          <td>华夏银行</td>
          <td>单笔50万、单日50万、单月无限额</td>
        </tr>
        <tr>
          <td>上海银行</td>
          <td>单笔5万、单日5万、单月10万</td>
        </tr>
        <tr>
          <td>网商银行</td>
          <td>单笔1万、单日1万、单月无限额</td>
        </tr>
        <tr>
          <td>各城市商业银行</td>
          <td>以各银行为准，如超限额会有提示</td>
        </tr>
      </table>
      <p style="color:red;" class="table_title">以上内容仅供参考，以各银行实际规定为主</p>
      <p style="color:red;" class="table_title">充值成功后请及时联系客服</p>
    </div>-->
    <div style="margin-top:50px;"></div>
    <mt-button type="primary" class="leftdiv" size="large" @click.native="detailedzhi()">支付一：支付宝快捷充值（5万以下）</mt-button>
    <div style="margin-top:20px;"></div>
    <mt-button type="primary" class="leftdiv" size="large" @click.native="detailedwang()">支付二：网银充值</mt-button>
    <mt-popup v-model="popupVisible3" position="right" class="mint-popup-3">
      <!--支付宝模块-->
      <mt-header fixed>
        <router-link to="" slot="left"><mt-button icon="back" @click.native="popupVisible3 = false">支付宝</mt-button></router-link>
      </mt-header>
      <div style="width:100%;height:1.5rem;"></div>
      <p class="text_top">支付一：支付宝快捷充值（5万以下）</p>
      <div class>
        <p style="text-align: center"><img :src="require('@/assets/zfb.jpeg')" style="width: 300px" alt /></p>
        <p style="text-align: center">
          <a href="https://qr.alipay.com/fkx03804rozmph6nnuf4d9c" style="text-align: center;color: #00a2e8;line-height: 1rem;font-size:.4rem; letter-spacing: 1px;">
            长按二维码或点击此链接充值
          </a>
        </p>
      </div>
      <p class="table_title">储蓄卡快捷支付限额总表</p>
      <table
        border="1"
        style="    width: 85%;
              margin: 0px auto;
              text-align: center;
              height:15rem;"
      >
        <tr>
          <th>银行</th>
          <th>额度</th>
        </tr>
        <tr>
          <td>中国银行</td>
          <td>单笔1万、单日1万、单月无限额</td>
        </tr>
        <tr>
          <td>农业银行</td>
          <td>单笔1万、单日1万、单月30万</td>
        </tr>
        <tr>
          <td>工商银行</td>
          <td>单笔1万、单日5万、单月10万</td>
        </tr>
        <tr>
          <td>交通银行</td>
          <td>单笔1万、单日1万、单月2万</td>
        </tr>
        <tr>
          <td>建设银行</td>
          <td>单笔1万、单日5万、单月10万</td>
        </tr>
        <tr>
          <td>平安银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>中信银行</td>
          <td>单笔5万、单日5万、单月无限额。</td>
        </tr>
        <tr>
          <td>光大银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>浦发银行</td>
          <td>单笔50万、单日50万、单月无限额</td>
        </tr>
        <tr>
          <td>招商银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>广发银行</td>
          <td>单笔3万、单日3万、单月无限额</td>
        </tr>
        <tr>
          <td>邮储银行</td>
          <td>单笔5000、单日5000、单月无限额</td>
        </tr>
        <tr>
          <td>民生银行</td>
          <td>单笔5万、单日5万、单月无限额</td>
        </tr>
        <tr>
          <td>兴业银行</td>
          <td>单笔3万、单日3万、单月无限额</td>
        </tr>
        <tr>
          <td>华夏银行</td>
          <td>单笔50万、单日50万、单月无限额</td>
        </tr>
        <tr>
          <td>上海银行</td>
          <td>单笔5万、单日5万、单月10万</td>
        </tr>
        <tr>
          <td>网商银行</td>
          <td>单笔1万、单日1万、单月无限额</td>
        </tr>
        <tr>
          <td>各城市商业银行</td>
          <td>以各银行为准，如超限额会有提示</td>
        </tr>
      </table>

      <p style="color:red;" class="table_title">以上内容仅供参考，以各银行实际规定为主</p>
    </mt-popup>
    <mt-popup v-model="popupVisible4" position="right" class="mint-popup-4" style="height:100%;">
      <!--网银模块-->
      <mt-header fixed>
        <router-link to="" slot="left"><mt-button icon="back" @click.native="popupVisible4 = false">网银</mt-button></router-link>
      </mt-header>
      <div style="width:100%;height:1rem;"></div>
      <p class="text_top">支付二：网银充值</p>
      <div class="tran_center">
        <p>周永谢</p>
        <p>中国农业银行</p>
        <p>充值卡号：6230521540012167674</p>
      </div>
      <div
        style="width:100%;
            margin:.5rem 0;"
      >
        <!-- <p class="table_title">储蓄卡快捷支付限额总表</p>
        <table
          border="1"
          style="    width: 85%;
              margin: 0px auto;
              text-align: center;
              height:15rem;"
        >
          <tr>
            <th>银行</th>
            <th>额度</th>
          </tr>
          <tr>
            <td>中国银行</td>
            <td>单笔1万、单日1万、单月无限额</td>
          </tr>
          <tr>
            <td>农业银行</td>
            <td>单笔1万、单日1万、单月30万</td>
          </tr>
          <tr>
            <td>工商银行</td>
            <td>单笔1万、单日5万、单月10万</td>
          </tr>
          <tr>
            <td>交通银行</td>
            <td>单笔1万、单日1万、单月2万</td>
          </tr>
          <tr>
            <td>建设银行</td>
            <td>单笔1万、单日5万、单月10万</td>
          </tr>
          <tr>
            <td>平安银行</td>
            <td>单笔5万、单日5万、单月无限额</td>
          </tr>
          <tr>
            <td>中信银行</td>
            <td>单笔5万、单日5万、单月无限额。</td>
          </tr>
          <tr>
            <td>光大银行</td>
            <td>单笔5万、单日5万、单月无限额</td>
          </tr>
          <tr>
            <td>浦发银行</td>
            <td>单笔50万、单日50万、单月无限额</td>
          </tr>
          <tr>
            <td>招商银行</td>
            <td>单笔5万、单日5万、单月无限额</td>
          </tr>
          <tr>
            <td>广发银行</td>
            <td>单笔3万、单日3万、单月无限额</td>
          </tr>
          <tr>
            <td>邮储银行</td>
            <td>单笔5000、单日5000、单月无限额</td>
          </tr>
          <tr>
            <td>民生银行</td>
            <td>单笔5万、单日5万、单月无限额</td>
          </tr>
          <tr>
            <td>兴业银行</td>
            <td>单笔3万、单日3万、单月无限额</td>
          </tr>
          <tr>
            <td>华夏银行</td>
            <td>单笔50万、单日50万、单月无限额</td>
          </tr>
          <tr>
            <td>上海银行</td>
            <td>单笔5万、单日5万、单月10万</td>
          </tr>
          <tr>
            <td>网商银行</td>
            <td>单笔1万、单日1万、单月无限额</td>
          </tr>
          <tr>
            <td>各城市商业银行</td>
            <td>以各银行为准，如超限额会有提示</td>
          </tr>
        </table> -->
        <!-- <p style="color:red;" class="table_title">以上内容仅供参考，以各银行实际规定为主</p>    -->
        <img src="@/assets/bankimg.png" class="banktu" alt="" />
        <p style="color:red;" class="table_title">充值成功后请及时联系客服</p>
      </div>
    </mt-popup>
  </div>
</template>

<script>
export default {
  data() {
    return {
      popupVisible3: false,
      popupVisible4: false
    };
  },
  methods: {
    back() {
      this.$router.go(-1);
    },
    detailedzhi() {
      this.popupVisible3 = true;
    },
    detailedwang() {
      this.popupVisible4 = true;
    }
  }
};
</script>

<style>
.tranfers_content_dsc {
  width: 90%;
  color: #fff;
  background: #78bdf1;
  margin: 0.5rem;
  font-size: 0.5rem;
  line-height: 1.4rem;
  padding: 0 0.5rem;
  box-sizing: border-box;
  border-radius: 5px;
  height: 10rem;
}
.tran_center {
  /* margin-top: 0.2rem; */
  width: 95%;
  background: #029ee8;
  font-size: 0.4rem;
  color: #fff;
  letter-spacing: 0.013333rem;
  line-height: 0.8rem;
  padding: 0.5rem 1rem;
  box-shadow: 0px 0px 10px #666;
  margin: 0.2rem auto;
  font-weight: bold;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 5px;
}
.text_top {
  width: 100%;
  height: 1rem;
  font-size: 0.45rem;
  letter-spacing: 2px;
  line-height: 1rem;
  padding: 0 1rem;
  font-weight: bold;
  padding: 0px 0.5rem;
  margin-top: 0.5rem;
}
.table_title {
  width: 100%;
  height: 1rem;
  font-size: 0.4rem;
  letter-spacing: 1px;
  line-height: 1rem;
  padding: 0 1rem;
}
.mint-popup-3 {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #fff;
  overflow-y: scroll;
}
.mint-popup-4 {
  width: 100%;
  overflow: hidden;
  height: 100%;
  background-color: #fff;
  overflow-y: scroll;
}
.banktu {
  width: 100%;
  height: 8rem;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
  margin-bottom: 40px;
}
.leftdiv {
  text-align: left;
  font-size: 32px;
  padding-left: 10px;
}
</style>
